<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="../jscripts/tiny_mce/tiny_mce_dev.js"></script>
<script type="text/javascript" src="js/testrunner.js"></script>
<link rel="stylesheet" href="css/unit.css" type="text/css" />
<script>
var editor;

test('commands - html4TextStyles', function() {
	var c;

	expect(9);

	editor.settings.inline_styles = false;
	editor.settings.convert_fonts_to_spans = false;

	editor.setContent('test 123');
	editor.execCommand('SelectAll');
	editor.execCommand('Bold');
	equals(editor.getContent(), "<p><strong>test 123</strong></p>");

	editor.setContent('test 123');
	editor.execCommand('SelectAll');
	editor.execCommand('Italic');
	equals(editor.getContent(), "<p><em>test 123</em></p>");

	editor.setContent('test 123');
	editor.execCommand('SelectAll');
	editor.execCommand('Underline');
	equals(editor.getContent(), "<p><u>test 123</u></p>");

	editor.setContent('test 123');
	editor.execCommand('SelectAll');
	editor.execCommand('Strikethrough');
	equals(editor.getContent(), "<p><strike>test 123</strike></p>");

	editor.setContent('test 123');
	editor.execCommand('SelectAll');
	editor.execCommand('FontName', false, 'Times');
	equals(editor.getContent(), '<p><font face="Times">test 123</font></p>');

	editor.setContent('test 123');
	editor.execCommand('SelectAll');
	editor.execCommand('FontSize', false, '7');
	equals(editor.getContent(), '<p><font size="7">test 123</font></p>');

	editor.setContent('test 123');
	editor.execCommand('SelectAll');
	editor.execCommand('ForeColor', false, '#FF0000');
	equals(editor.getContent().toLowerCase(), '<p><font color="#ff0000">test 123</font></p>');

	editor.setContent('test 123');
	editor.execCommand('SelectAll');
	editor.execCommand('HiliteColor', false, '#FF0000');
	c = editor.getContent();
	ok(c == '<p><span style="background-color: #ff0000;">test 123</span></p>' || c == '<p><font style="background-color: #ff0000;">test 123</font></p>');

	editor.setContent('<font style="background-color: red" color="#ff0000">test</font><font face="Arial">test</font>');
	equals(editor.getContent(), '<p><font style="background-color: red;" color="#ff0000">test</font><font face="Arial">test</font></p>');

	editor.settings.inline_styles = true;
});

test('commands - xhtmlTextStyles', function() {
	var c;

	expect(18);

	editor.settings.inline_styles = true;
	editor.settings.convert_fonts_to_spans = true;

	editor.setContent('test 123');
	editor.execCommand('SelectAll');
	editor.execCommand('Bold');
	equals(editor.getContent(), "<p><strong>test 123</strong></p>");

	editor.setContent('test 123');
	editor.execCommand('SelectAll');
	editor.execCommand('Italic');
	equals(editor.getContent(), "<p><em>test 123</em></p>");

	editor.setContent('test 123');
	editor.execCommand('SelectAll');
	editor.execCommand('Underline');
	equals(editor.getContent(), '<p><span style="text-decoration: underline;">test 123</span></p>');

	editor.setContent('test 123');
	editor.execCommand('SelectAll');
	editor.execCommand('Strikethrough');
	equals(editor.getContent(), '<p><span style="text-decoration: line-through;">test 123</span></p>');

	editor.setContent('test 123');
	editor.execCommand('SelectAll');
	editor.execCommand('FontName',false,'Arial');
	equals(editor.getContent(), '<p><span style="font-family: Arial;">test 123</span></p>');

	editor.setContent('test 123');
	editor.execCommand('SelectAll');
	editor.execCommand('FontSize',false,'7');
	equals(editor.getContent(), '<p><span style="font-size: xx-large;">test 123</span></p>');

	editor.setContent('test 123');
	editor.execCommand('SelectAll');
	editor.execCommand('ForeColor', false, '#FF0000');
	equals(editor.getContent(), '<p><span style="color: #ff0000;">test 123</span></p>');

	editor.setContent('test 123');
	editor.execCommand('SelectAll');
	editor.execCommand('HiliteColor', false, '#FF0000');
	equals(editor.getContent(), '<p><span style="background-color: #ff0000;">test 123</span></p>');

	editor.setContent('<p><span style="text-decoration: underline;">test 123</span></p>');
	equals(editor.getContent(), '<p><span style="text-decoration: underline;">test 123</span></p>');

	editor.setContent('<p><span style="text-decoration: line-through;">test 123</span></p>');
	equals(editor.getContent(), '<p><span style="text-decoration: line-through;">test 123</span></p>');

	editor.setContent('<p><span style="font-family: Arial;">test 123</span></p>');
	equals(editor.getContent(), '<p><span style="font-family: Arial;">test 123</span></p>');

	editor.setContent('<p><span style="font-size: xx-large;">test 123</span></p>');
	equals(editor.getContent(), '<p><span style="font-size: xx-large;">test 123</span></p>');

	editor.setContent('<p><u>test 123</u></p>');
	equals(editor.getContent(), '<p><span style="text-decoration: underline;">test 123</span></p>');

	editor.setContent('<p><strike>test 123</strike></p>');
	equals(editor.getContent(), '<p><span style="text-decoration: line-through;">test 123</span></p>');

	editor.setContent('<p><font face="Arial">test 123</font></p>');
	equals(editor.getContent(), '<p><span style="font-family: Arial;">test 123</span></p>');

	editor.setContent('<p><font size="7">test 123</font></p>');
	equals(editor.getContent(), '<p><span style="font-size: xx-large;">test 123</span></p>');

	editor.setContent('<p><font face="Arial" size="7">test 123</font></p>');
	c = editor.getContent();
	ok(c == '<p><span style="font-family: Arial; font-size: xx-large;">test 123</span></p>' || c == '<p><span style="font-size: xx-large; font-family: Arial;">test 123</span></p>');

	editor.setContent('<font style="background-color: #ff0000" color="#ff0000">test</font><font face="Arial">test</font>');

	// Both responses are ok
	if (editor.getContent() == '<p><span style="background-color: #ff0000; color: #ff0000;">test</span><span style="font-family: Arial;">test</span></p>')
		ok(true);

	if (editor.getContent() == '<p><span style="color: #ff0000; background-color: #ff0000;">test</span><span style="font-family: Arial;">test</span></p>')
		ok(true);
});

test('commands - alignInline', function() {
	editor.settings.inline_styles = true;

	expect(7);

	editor.setContent('<p>test 123</p>');
	editor.execCommand('SelectAll');
	editor.execCommand('JustifyLeft');
	equals(editor.getContent(), '<p style="text-align: left;">test 123</p>');

	editor.setContent('<p>test 123</p>');
	editor.execCommand('SelectAll');
	editor.execCommand('JustifyCenter');
	equals(editor.getContent(), '<p style="text-align: center;">test 123</p>');

	editor.setContent('<p>test 123</p>');
	editor.execCommand('SelectAll');
	editor.execCommand('JustifyRight');
	equals(editor.getContent(), '<p style="text-align: right;">test 123</p>');

	editor.setContent('<p>test 123</p>');
	editor.execCommand('SelectAll');
	editor.execCommand('JustifyFull');
	equals(editor.getContent(), '<p style="text-align: justify;">test 123</p>');

	editor.setContent('<img src="../media/logo.jpg" />');
	editor.selection.select(editor.dom.select('img')[0]);
	editor.execCommand('JustifyLeft');
	equals(editor.getContent(), '<p><img style="float: left;" src="../media/logo.jpg" alt="" /></p>');

	editor.setContent('<img src="../media/logo.jpg" />');
	editor.selection.select(editor.dom.select('img')[0]);
	editor.execCommand('JustifyCenter');
	equals(editor.getContent(), '<p style="text-align: center;"><img src="../media/logo.jpg" alt="" /></p>');

	editor.setContent('<img src="../media/logo.jpg" />');
	editor.selection.select(editor.dom.select('img')[0]);
	editor.execCommand('JustifyRight');
	equals(editor.getContent(), '<p><img style="float: right;" src="../media/logo.jpg" alt="" /></p>');
});

test('commands - blockquote', function() {
	expect(2);

	editor.setContent('<p>test 123</p>');
	editor.execCommand('SelectAll');
	editor.execCommand('mceBlockQuote');
	equals(editor.getContent().replace(/\s+/g, ''), '<blockquote><p>test123</p></blockquote>');

	editor.setContent('<p>test 123</p><p>test 123</p>');
	editor.execCommand('SelectAll');
	editor.execCommand('mceBlockQuote');
	equals(editor.getContent().replace(/\s+/g, ''), '<blockquote><p>test123</p><p>test123</p></blockquote>');
});

test('commands - blocks', function() {
	expect(9);

	editor.setContent('<p>test 123</p>');
	editor.execCommand('SelectAll');
	editor.execCommand('FormatBlock', false, 'h1');
	equals(editor.getContent(), '<h1>test 123</h1>');

	editor.execCommand('SelectAll');
	editor.execCommand('FormatBlock', false, 'h2');
	equals(editor.getContent(), '<h2>test 123</h2>');

	editor.execCommand('SelectAll');
	editor.execCommand('FormatBlock', false, 'h3');
	equals(editor.getContent(), '<h3>test 123</h3>');

	editor.execCommand('SelectAll');
	editor.execCommand('FormatBlock', false, 'h4');
	equals(editor.getContent(), '<h4>test 123</h4>');

	editor.execCommand('SelectAll');
	editor.execCommand('FormatBlock', false, 'h5');
	equals(editor.getContent(), '<h5>test 123</h5>');

	editor.execCommand('SelectAll');
	editor.execCommand('FormatBlock', false, 'h6');
	equals(editor.getContent(), '<h6>test 123</h6>');

	editor.execCommand('SelectAll');

	try {
		editor.execCommand('FormatBlock', false, 'div');
	} catch (ex) {
		//t.log('Failed: ' + ex.message);
	}

	equals(editor.getContent(), '<div>test 123</div>');

	editor.execCommand('SelectAll');
	editor.execCommand('FormatBlock', false, 'address');
	equals(editor.getContent(), '<address>test 123</address>');

	editor.execCommand('SelectAll');
	editor.execCommand('FormatBlock', false, 'pre');
	equals(editor.getContent(), '<pre>test 123</pre>');
});

test('commands - styles', function() {
	expect(1);

	editor.setContent('<p>test 123</p>');
	editor.execCommand('SelectAll');
	editor.execCommand('mceSetStyleInfo', false, {command : 'setattrib', name : "class", value : 'test1'});
	equals(editor.getContent(), '<p class="test1">test 123</p>');
});

test('commands - link', function() {
	expect(4);

	editor.setContent('test 123');
	editor.execCommand('SelectAll');
	editor.execCommand('mceInsertLink', false, 'test');
	equals(editor.getContent(), '<p><a href="test">test 123</a></p>');

	editor.setContent('<p>test 123</p>');
	editor.execCommand('SelectAll');
	editor.execCommand('mceInsertLink', false, 'http://www.site.com');
	equals(editor.getContent(), '<p><a href="http://www.site.com">test 123</a></p>');

	editor.setContent('<p>test 123</p>');
	editor.execCommand('SelectAll');
	editor.execCommand('mceInsertLink', false, '"&<>');
	equals(editor.getContent(), '<p><a href="&quot;&amp;&lt;&gt;">test 123</a></p>');

	editor.setContent('<p>test 123</p>');
	editor.execCommand('SelectAll');
	editor.execCommand('mceInsertLink', false, {href : '"&<>', 'class' : 'test'});
	equals(editor.getContent(), '<p><a class="test" href="&quot;&amp;&lt;&gt;">test 123</a></p>');
});

test('commands - unlink', function() {
	expect(1);

	editor.setContent('<p><a href="test">test</a> <a href="test">123</a></p>');
	editor.execCommand('SelectAll');
	editor.execCommand('unlink');
	equals(editor.getContent(), '<p>test 123</p>');
});

test('commands - subscriptSuperscript', function() {
	expect(4);

	editor.setContent('<p>test 123</p>');
	editor.execCommand('SelectAll');
	editor.execCommand('subscript');
	equals(editor.getContent(), '<p><sub>test 123</sub></p>');

	editor.setContent('<p>test 123</p>');
	editor.execCommand('SelectAll');
	editor.execCommand('superscript');
	equals(editor.getContent(), '<p><sup>test 123</sup></p>');

	editor.setContent('<p>test 123</p>');
	editor.execCommand('SelectAll');
	editor.execCommand('subscript');
	editor.execCommand('subscript');
	equals(editor.getContent(), '<p>test 123</p>');

	editor.setContent('<p>test 123</p>');
	editor.execCommand('SelectAll');
	editor.execCommand('superscript');
	editor.execCommand('superscript');
	equals(editor.getContent(), '<p>test 123</p>');
});

test('commands - insertHR', function() {
	var v;

	expect(1);

	editor.setContent('<p>test 123</p>');
	editor.execCommand('SelectAll');
	editor.execCommand('InsertHorizontalRule');

	// There is some browser differences that we can live with
	v = '<hr />';

	if (tinymce.isOpera)
		v = '<hr /><p>&nbsp;</p>';

	if (tinymce.isWebKit)
		v = '<p><hr /></p>';

	equals(editor.getContent(), v);
});

test('commands - indentOutdent', function() {
	expect(4);

	editor.setContent('<p>test 123</p>');
	editor.execCommand('SelectAll');
	editor.execCommand('Indent');
	equals(editor.getContent(), '<p style="padding-left: 30px;">test 123</p>');

	editor.setContent('<p>test 123</p>');
	editor.execCommand('SelectAll');
	editor.execCommand('Indent');
	editor.execCommand('Indent');
	equals(editor.getContent(), '<p style="padding-left: 60px;">test 123</p>');

	editor.setContent('<p>test 123</p>');
	editor.execCommand('SelectAll');
	editor.execCommand('Indent');
	editor.execCommand('Indent');
	editor.execCommand('Outdent');
	equals(editor.getContent(), '<p style="padding-left: 30px;">test 123</p>');

	editor.setContent('<p>test 123</p>');
	editor.execCommand('SelectAll');
	editor.execCommand('Outdent');
	equals(editor.getContent(), '<p>test 123</p>');
});

test('commands - removeFormat', function() {
	var t = this;

	expect(3);

	editor.setContent('<p><span>test</span> <strong>123</strong> <a href="123">123</a> 123</p>');
	editor.execCommand('SelectAll');
	editor.execCommand('RemoveFormat');
	equals(editor.getContent(), '<p>test 123 <a href="123">123</a> 123</p>');

	editor.setContent('<p><span><span>test</span> <strong>123</strong> <a href="123">123</a> 123</span></p>');
	editor.execCommand('SelectAll');
	editor.execCommand('RemoveFormat');
	equals(editor.getContent(), '<p>test 123 <a href="123">123</a> 123</p>');

	editor.setContent('<p><span>test<span id="x">test <strong>123</strong></span><a href="123">123</a> 123</span></p>');
	editor.selection.select(editor.dom.get('x'));
	editor.execCommand('RemoveFormat');
	equals(editor.getContent(), '<p><span>test</span>test 123<span><a href=\"123\">123</a> 123</span></p>');
});

test('commands - customCommands', function() {
	var t = this;

	expect(1);

	editor.execCommand('mceSetContent', false, '<p>test 123 abc</p>');
	equals(editor.getContent(), '<p>test 123 abc</p>');

/*		editor.setContent('<p>test <span>1<span>2</span>3</span> abc</p>');
	editor.selection.select(editor.dom.select('span')[0], 1);
	editor.execCommand('mceReplaceContent', false, '<p>test <span>aaa1<span>2</span>3bbb</span></p>');
	equals(editor.getContent(), '<div>aaatest 123bbb</div>');

	editor.setContent('test 123');
	editor.execCommand('SelectAll');
	editor.selection.collapse(1);
	editor.execCommand('mceInsertContent', false, 'abc');
	equals(editor.getContent(), '<p>test 123 abc</p>');*/
});

test('internals - forcedBlocks', function() {
	expect(4);

	editor.setContent('<p></p><p>&nbsp;</p><p /><p id="x"></p><p id="y">&nbsp;</p><p id="z" />');
	equals(editor.getContent(), '<p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p><p id="x">&nbsp;</p><p id="y">&nbsp;</p><p id="z">&nbsp;</p>');

	editor.setContent('test <strong>test2</strong> <em>test3</em>');
	equals(editor.getContent(), '<p>test <strong>test2</strong> <em>test3</em></p>');

	editor.setContent('<p>test</p>test <strong>test2</strong> <em>test3</em>');
	equals(editor.getContent(), '<p>test</p><p>test <strong>test2</strong> <em>test3</em></p>');

	editor.setContent('<p>test 1</p>test <strong>test2</strong> <em>test3</em><p>test 2</p>test');
	equals(editor.getContent(), '<p>test 1</p><p>test <strong>test2</strong> <em>test3</em></p><p>test 2</p><p>test</p>');
});

test('internals - explorerBugs', function() {
	expect(2);

	// Don't run real test on non IE browsers
	if (!tinymce.isIE) {
		ok(1);
		ok(1);
		return;
	}

	editor.setContent('<p><span><ul><li>Item 1</li></ul></span></p>');
	equals(editor.getContent(), '<p><span><ul><li>Item 1</li></ul></span></p>');

	editor.setContent('<p class="test">test1</p><p><div>test2</div></p><p class="test">test3</p>');
	equals(editor.getContent(), tinymce.isIE ? '<p class="test">test1</p><p><div>test2</div></p><p class="test">test3</p>' : '<p class="test">test1</p><p>&nbsp;</p><div>test2</div><p>&nbsp;</p><p class="test">test3</p>');
});

test('urls - relativeURLs', function() {
	expect(5);

	editor.settings.relative_urls = true;
	editor.documentBaseURI = new tinymce.util.URI('http://www.site.com/dirA/dirB/dirC/');

	editor.setContent('<a href="test.html">test</a>');
	equals(editor.getContent(), '<p><a href="test.html">test</a></p>');

	editor.setContent('<a href="../test.html">test</a>');
	equals(editor.getContent(), '<p><a href="../test.html">test</a></p>');

	editor.setContent('<a href="test/test.html">test</a>');
	equals(editor.getContent(), '<p><a href="test/test.html">test</a></p>');

	editor.setContent('<a href="/test.html">test</a>');
	equals(editor.getContent(), '<p><a href="../../../test.html">test</a></p>');

	editor.setContent('<a href="http://www.somesite.com/test/file.htm">test</a>');
	equals(editor.getContent(), '<p><a href="http://www.somesite.com/test/file.htm">test</a></p>');
});

test('urls - absoluteURLs', function() {
	expect(8);

	editor.settings.relative_urls = false;
	editor.settings.remove_script_host = true;
	editor.documentBaseURI = new tinymce.util.URI('http://www.site.com/dirA/dirB/dirC/');

	editor.setContent('<a href="test.html">test</a>');
	equals(editor.getContent(), '<p><a href="/dirA/dirB/dirC/test.html">test</a></p>');

	editor.setContent('<a href="../test.html">test</a>');
	equals(editor.getContent(), '<p><a href="/dirA/dirB/test.html">test</a></p>');

	editor.setContent('<a href="test/test.html">test</a>');
	equals(editor.getContent(), '<p><a href="/dirA/dirB/dirC/test/test.html">test</a></p>');

	editor.setContent('<a href="http://www.somesite.com/test/file.htm">test</a>');
	equals(editor.getContent(), '<p><a href="http://www.somesite.com/test/file.htm">test</a></p>');

	editor.settings.relative_urls = false;
	editor.settings.remove_script_host = false;

	editor.setContent('<a href="test.html">test</a>');
	equals(editor.getContent(), '<p><a href="http://www.site.com/dirA/dirB/dirC/test.html">test</a></p>');

	editor.setContent('<a href="../test.html">test</a>');
	equals(editor.getContent(), '<p><a href="http://www.site.com/dirA/dirB/test.html">test</a></p>');

	editor.setContent('<a href="test/test.html">test</a>');
	equals(editor.getContent(), '<p><a href="http://www.site.com/dirA/dirB/dirC/test/test.html">test</a></p>');

	editor.setContent('<a href="http://www.somesite.com/test/file.htm">test</a>');
	equals(editor.getContent(), '<p><a href="http://www.somesite.com/test/file.htm">test</a></p>');
});

test('editor_methods - getParam', function() {
	expect(5);

	editor.settings.test = 'a,b,c';
	equals(editor.getParam('test', '', 'hash')['c'], 'c');

	editor.settings.test = 'a';
	equals(editor.getParam('test', '', 'hash')['a'], 'a');

	editor.settings.test = 'a=b';
	equals(editor.getParam('test', '', 'hash')['a'], 'b');

	editor.settings.test = 'a=b;c=d,e';
	equals(editor.getParam('test', '', 'hash')['c'], 'd,e');

	editor.settings.test = 'a=b,c=d';
	equals(editor.getParam('test', '', 'hash')['c'], 'd');
});

test('WebKit Serialization range bug', function() {
	expect(1);

	editor.getBody().innerHTML = '<p>123<table><tbody><tr><td>X</td></tr></tbody></table>456</p>';
	equals(editor.getContent(), '<p>123</p><table><tbody><tr><td>X</td></tr></tbody></table><p>456</p>');
});

tinyMCE.init({
	mode : "textareas",
	theme : "advanced",
	add_unload_trigger : false,
	plugins : 'safari',
	theme_advanced_styles : 'test1=test1;test2=test2',
	apply_source_formatting : 0,
	init_instance_callback : function(ed) {
		editor = ed;
		run();
	}
});
</script>
</head>
<body>
	<h1>Basic editor functionality tests</h1>
	<h2 id="banner"></h2>
	<h2 id="userAgent"></h2>
	<ol id="tests"></ol>
	<div id="main"></div>
	<div id="content">
		<textarea id="elm1" name="elm1"></textarea>
		<div>
			<a href="javascript:alert(tinymce.EditorManager.get('elm1').getContent({format : 'raw'}));">[getRawContents]</a>
			<a href="javascript:alert(tinymce.EditorManager.get('elm1').getContent());">[getContents]</a>
		</div>
	</div>
</body>
</html>
